<template>
  <div class="look">
    <!-- 查看组件 -->
    <div>
      <el-dialog
        title="查看详情"
        :visible.sync="DialogVisible"
        :show-close="false"
        width="1000px"
        :before-close="handleClose"
        :destroy-on-close="true"
      >
        <div class="lookAll">
          <div
            class="list"
            v-for="(item, index) in attributeOrder"
            :key="index"
            v-if="item.examineSign"
          >
            <span class="fon">{{ item.CN }}:</span>
            <span class="inb" v-if="item.type === 'select'">
              {{
                optionDatass(
                  item.typeGroupCode
                    ? optionsZi[item.EN]
                    : searchOptionTable[item.EN],
                  modData[item.EN],
                  item.EN,
                  item
                )
              }}
            </span>

            <span class="inb" v-else>{{ modData[item.EN] }}</span>
          </div>
          <!-- <fl-parameter
            @deleteselectarr="deleteselectarr"
            :allinorselect="false"
            :paramarr="paramarr"
            :isviews="false"
          ></fl-parameter> -->
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button type="primary" @click="confirm" size="mini"
            >确定</el-button
          >
        </span>
      </el-dialog>
    </div>
  </div>
</template>
<script>
import flParameter from "@/views/collection/base/flProductModel/table.vue";

export default {
  name: "examine",
  data() {
    return {
      DialogVisible: false,
    };
  },
  components: {
    flParameter,
  },
  props: [
    "DialogVisibleMod",
    "modData",
    "attributeOrder",
    "optionsZi",
    "searchOptionTable",
    "getFindByTypeData",
  ],
  created() {
    console.log(this.modData, "***********************");
    console.log(this.attributeOrder, "attributeOrder");
    // this.DialogVisible=JSON.parse(JSON.stringify(this.DialogVisibleMod))
  },
  watch: {
    DialogVisibleMod: {
      deep: true,
      handler(newVal, oldVal) {
        this.DialogVisible = newVal;
        console.log(this.DialogVisible,"DialogVisible");
        console.log(this.modData)

      },
    },
    // DialogVisibleMod(newVal,oldVal){
    //    console.log('查看组件',newVal)
    //    this.DialogVisible=JSON.parse(JSON.stringify(newVal))
    // }
  },
  methods: {
    handleClose(done) {
      // this.$confirm('确认关闭？')
      //   .then(_ => {
      //     this.DialogVisible=!this.DialogVisible
      //     done();
      //   })
      //   .catch(_ => {});
    },
    confirm() {
      this.DialogVisible = false;
      console.log("1111");
      this.$emit("examineDialog", this.DialogVisible);
    },
  },
  computed: {
    // 字典计算属性
    optionDatass() {
      return function (arr, val, EN, data) {
        // console.log(arr,val,EN,'99999');

        // console.log(arr[val],'why');
        // 判断特殊
        if (EN == "sysCompanyCode") {
          const getFindByTypeData = this.getFindByTypeData;
          console.log(getFindByTypeData, 9999999999);

          for (let i = 0; i < getFindByTypeData.length; i++) {
            const element = getFindByTypeData[i];
            if (getFindByTypeData[i].sysCompanyCode == val) {
              return getFindByTypeData[i].name;
            }
          }
        }
        if (arr) {
          if (
            EN == "meterreader" &&
            data.isMeterreaderMultiple &&
            val.includes(",")
          ) {
            val = val.split(",");
            let names = "";
            console.log("val：：", val);
            for (let j = 0; j < val.length; j++) {
              for (let i = 0; i < arr.length; i++) {
                if (val[j] == arr[i].value) {
                  names += arr[i].label + ",";
                }
              }
            }
            return names.substring(0, names.length - 1);
          } else {
            for (let i = 0; i < arr.length; i++) {
              if (arr[i].value == val) {
                return arr[i].label;
              }
            }
          }
        }
      };
    },
  },
};
</script>
<style lang="scss" scoped>
.look {
  .lookAll {
    // max-height: 500px;
    // overflow: hidden;
    .list {
      height: 40px;
      line-height: 40px;
      border-bottom: 1px solid #e8e8e8;
      display: flex;
      .fon {
        width: 16.55%;
        text-align: right;
        margin-right: 20px;
      }
      .inb {
        width: 83.45%;
      }
    }
  }
}
</style>
